<template>
  <div class="view-more">
    {{ title || $t('No_more') }}
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: ''
    }
  }
};
</script>

<style lang="scss" scoped>
.view-more {
  background: rgba(12, 12, 28, 0);
  border-radius: 22px;
  height: 44px;
  width: 100%;
  font-size: 16px;
  color: rgba(12, 12, 28, 0.5);
  line-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;

  &:before,
  &:after {
    content: '';
    height: 1px;
    background: rgba(12, 12, 28, 0.5);
    width: 96px;
  }

  &:before {
    margin-right: 6px;
  }

  &:after {
    margin-left: 6px;
  }
}
</style>
